function setStyle(dom, cssObj) {
  Object.keys(cssObj || {}).forEach(function (key) {
    dom.style[key] = cssObj[key];
  });
}

/**
 * 检查 是否是 HTML 元素
 *
 * @param obj
 * @returns {boolean}
 */
function isHTMLElement(obj) {
  try {
    return !!obj.cloneNode(true);
  } catch (e) {
    return false;
  }
}

function createElement(element, attrs, children) {
  const elementNode = document.createElement(element);

  if (attrs && typeof attrs === 'object') {
    for (let key in attrs) {
      if (key === 'style') {
        setStyle(elementNode, attrs['style']);
      } else {
        elementNode.setAttribute(key, attrs[key])
      }
    }
  }

  if (children) {
    if (Array.isArray(children)) {
      children.forEach(function (child) {
        if (isHTMLElement(child)) {
          elementNode.appendChild(child)
        }
      })
    } else {
      if (isHTMLElement(children)) {
        elementNode.appendChild(children)
      }
    }
  }

  return elementNode
}

function setBoxData($container) {
  const { offsetLeft: left, offsetTop: top, offsetHeight, offsetWidth, clientHeight, clientWidth } = $container;
  const width = clientWidth || offsetWidth;
  const height = clientHeight || offsetHeight;
  const right = left + width;
  const bottom = top + height;

  box = { left, top, width, height, right, bottom };
}
